<template>
  <div class="flex" style="width: 240px">
    <el-input
      :controls="false"
      v-model="formData.start"
      placeholder="最小值"
      :precision="precision"
      @keydown.native="SkuUtil.handleLimitInteger"/>
    <div style="width: 30px;text-align: center">-</div>
    <el-input
      :controls="false"
      v-model="formData.end"
      placeholder="最大值"
      :precision="precision"
      @keydown.native="SkuUtil.handleLimitInteger"/>
  </div>
</template>

<script>
import SkuUtil from "@/framework/components/sku/SkuUtil";

export default {
  name: "NumberRange",
  props: {
    value: [String, Number, Array, Object],
    precision: {
      type: Number
    }
  },
  watch: {
    value() {
      if (!this.value) {
        this.formData.start = ''
        this.formData.end = ''
        return
      }
      Object.assign(this.formData, this.value)
    },
    formData: {
      deep: true,
      handler() {
        this.$emit('input', this.formData)
      }
    }
  },
  data() {
    return {
      SkuUtil,
      formData: {
        start: '',
        end: ''
      }
    }
  },
  methods: {}
}
</script>

<style scoped>

</style>
